<!-- 服务台详情 -->
<template>
	<ListLayout>

		<TimeChange @onTime="onTimeChange"></TimeChange>

		<view class="top">

		</view>

		<!-- 服务台总览 -->
		<OverViewCard :data="data"></OverViewCard>
		<!-- 已接电话 -->
		<InfoCard type="YiJieDianHua" :data="YiJieDianHua"></InfoCard>
		<!-- 未接电话 -->
		<InfoCard type="WeiJieDianHua" :data="WeiJieDianHua"></InfoCard>
		<!-- 已建工单 -->
		<InfoCard type="YiJianGongDan" :data="YiJianGongDan"></InfoCard>
		<!-- 未建工单 -->
		<InfoCard type="WeiJianGongDan" :data="WeiJianGongDan"></InfoCard>
		<!-- 电话找人 -->
		<InfoCard type="DianHuaZhaoRen" :data="DianHuaZhaoRen"></InfoCard>
		<!-- 服务台解决详情 -->
		<InfoCard type="FuWuTaiJieJue" :data="FuWuTaiJieJue"></InfoCard>
		<!-- 无效电话详情 -->
		<InfoCard type="WuXiaoDianHua" :data="WuXiaoDianHua"></InfoCard>
	</ListLayout>
</template>

<script>
	import ListLayout from '@/components/layout/listLayout.vue'
	import OverViewCard from '@/pagesDesk/card/overView.vue'
	import InfoCard from '@/pagesDesk/card/info.vue'
	import TimeChange from '@/pages/news/components/timeChange.vue'
	import { getServeData } from '@/apis/daily.js'
	import Colors from '@/common/color.js'
	let currState = {
		'完成': Colors.green,
		'暂停': Colors.yellow,
		'处理中': Colors.blue
	}

	function dataPack(obj, totalKey, userArrKey, detailArrKey) {

		if (obj) {
			let total = obj[totalKey]
			let personArr = obj[userArrKey] || []
			let detailArr = obj[detailArrKey] || []
			let list = detailArr.map((item) => {
				return {
					deptName: item.deptIdToName || '-',
					phone: item.phone || '-',
					time: item.createTime || '-',
					seatName: item.receptionToName || '-',
					findUserName: item?.findUserToName || '-',
					findUserPhone: item?.findUserPhone || '-',
					state: {
						color: currState[item.currStateToName] || '',
						label: item.currStateToName || ''
					}
				}
			})
			return {
				total,
				personArr,
				list,
			}

		}
		return {
			total: '',
			personArr: [],
			list: [],
		}


	}
	export default {

		components: {
			ListLayout,
			TimeChange,
			OverViewCard,
			InfoCard,
		},

		computed: {

			YiJieDianHua() {
				return dataPack(this.data, 'answer', 'answerWorkOrderNum', 'answerOrderMessage')

			},
			WeiJieDianHua() {
				return dataPack(this.data, 'notAnswer', 'notAnswerWorkOrderNum', 'notAnswerOrderMessage')
			},
			YiJianGongDan() {
				return dataPack(this.data, 'createOrder', 'createOrderWorkOrderNum', 'createOrderOrderMessage')
			},
			WeiJianGongDan() {
				return dataPack(this.data, 'answer', 'noCreateOrderWorkOrderNum', 'noCreateOrderOrderMessage')
			},
			DianHuaZhaoRen() {
				return dataPack(this.data, 'phoneLook', 'phoneLookWorkOrderNum', 'phoneLookOrderMessage')
			},
			FuWuTaiJieJue() {
				return dataPack(this.data, 'workMake', 'workMakeWorkOrderNum', 'workMakeOrderMessage')
			},
			WuXiaoDianHua() {
				return dataPack(this.data, 'phoneInvalid', 'phoneInvalidWorkOrderNum', 'phoneInvalidOrderMessage')
			},
		},
		data() {
			return {
				data: null
			}
		},
		onLoad() {
			this.initData()
		},
		methods: {
			onTimeChange(date) {
				this.initData(date)
			},

			initData(date = null) {
				wx.showLoading({
					title: '加载中..'
				})
				let time = date || this.$options.filters.date(Date.now())
				getServeData(time).then((res) => {
					if (res.code == 0) {
						this.data = res.body
						wx.hideLoading()
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.top {
		height: 100rpx;
	}
</style>
